var aaa;

$(function() {

	function c(k) {
		return console.log(k);
	}

	function ajax(url, param, type) {
		return $.ajax({
			url: url,
			data: param || {},
			type: type || 'GET'
		})
	}

	var local = {
		set: function(key, val) {
			return localStorage.setItem(key, val);
		},
		get: function(key) {
			return localStorage.getItem(key);
		},
		del: function(key) {
			return localStorage.removeItem(key);
		}
	}

	var Card = (function(opts) {

		// Card对象
		function Card() {
			this.defs = {

			}
			this.init();
		}

		// 初始化
		Card.prototype.init = function() {
			this.$prizeList = $('.prize-list');
			this.$lis = this.$prizeList.find('.li');
			this.len = this.$lis.length;
			this.index = 2; //当前这张牌
			this.queueI = "";
			this.hasBeenSecret = []; //是否已展开过奖品
			this.isAnimating = false; //是否正有动画在执行
			this.luckBtnTime = "";
			this.instace = {};
			this.instace.dragEl = this.$lis.eq(this.index).find('.avatar');
			this.instace.moveEl = this.$lis.eq(this.index).find('.front-f');
			this.instace.mouseOffsetLeft = 0;
			this.instace.mouseOffsetTop = 0;
			this.mousePosition = {
				x: 0,
				y: 0
			};
			this.initTop = 0;
			this.dragTime = "";
			this.isDrag = false;

			for (var i = 0; i < this.len; i++) {
				this.$lis.eq(i).attr('data-index', i);
				this.$lis.eq(i).attr('data-queue-index', i);
				this.hasBeenSecret[i] = local.get('secret' + i) ? true : false;
				if (this.hasBeenSecret[i]) {
					this.$lis.eq(i).find('.front-wrap').remove();
				}
			}
			this.defs = $.extend(true, {}, this.defs, opts);
			this.eve();
		}

		// 初始化事件
		Card.prototype.eve = function() {
			var that = this;
			//绑定每张牌的点击事件
			that.$prizeList.on('click', '.li', function(event) {
				event.preventDefault();
				c(event);
				c('79');
				var $this = $(this);
				that.index = $this.attr('data-index');
				that.queueI = $this.attr('data-queue-index');
				if (that.isAnimating) {
					c("正在动画...");
					return;
				} else {
					// 设置执行动画
					that.isAnimating = true;
					that.showMask('.blur-mask');
					that.showMask('.stage-mask');
					if (that.hasBeenSecret[that.index]) {
						that.sortIndex();
					} else {
						local.set('secret' + that.index, true);
						that.hasBeenSecret[that.index] = true;
						that.showPrize();
					}
				}
			});

			//绑定当前牌的hover效果
			//必须用on去代理 mouseenter mouseleave事件
			that.$prizeList.on('mouseenter mouseleave', '.act', function(event) {
				event.preventDefault();
				event.stopPropagation();
				$luckBtn = $(this).find('.luck-btn');
				/*var $html = $('<div class="luck-btn"></div>');
				if(event.type == "mouseenter"){
					clearTimeout(that.luckBtnTime);
					$(this).append($html);
					$html.css('opacity', 1);
					// $(this).find('.luck-btn').css('opacity', 1);
				}else if(event.type == "mouseleave"){
					$(this).find('.luck-btn').css('opacity', 0);
					that.luckBtnTime = setTimeout(function(){
						c($html)
						$html.remove();
					},600)
 				}*/
				if (event.type == "mouseenter") {
					clearTimeout(that.luckBtnTime);
					$luckBtn.css('display', 'block');
					$luckBtn.css('display');
					$luckBtn.css('opacity', 1);
				} else if (event.type == "mouseleave") {
					$luckBtn.css('opacity', 0);
					that.luckBtnTime = setTimeout(function() {
						$luckBtn.css('display', 'none');
					}, 600)
				}
			});

			// 绑定当前牌的按钮点击
			that.$prizeList.on('mousedown mouseup click', '.act .luck-btn', function(event) {
				event.preventDefault();
				event.stopPropagation();
				var time = "";
				if (event.type == "mousedown") {
					c('mousedown!');
					c('138')
					$(this).css('background-image', 'url(images/luck-btn-press.png)');
				} else if (event.type == "mouseup") {
					c('mouseup!');
					c('141')
					$(this).css({
						'background-image': 'url(images/luck-btn-def.png)',
						'opacity': 0
					});
				} else if (event.type == "click") {
					c('click!');
					c('148');
					that.isAnimating = true;
					that.showMask('.stage-mask');
					that.showMask('.prize-mask');
					//短暂延迟后，牌旋转，并去请求接口
					that.getPrizeUser();
					time = setTimeout(function() {
						that.stopSpin();
						that.hideMask('.stage-mask');
						that.isAnimating = false;
						c(that.isAnimating)
					}, 5300)
				}
			});

			// 隐藏blur遮罩
			$(".blur-mask").on('click', function(event) {
				event.preventDefault();
				that.hideBlur();
				$(this).css('display', 'none');
			});

			// 隐藏prize遮罩
			$('.prize-mask').on('click', function(event) {
				event.preventDefault();
				//请求接口确认中奖人,然后隐藏prize-mask,隐藏中奖人
				that.hidePrizeUser();
			});

			// 拖拽中奖人效果
			that.instace.dragEl.on('mousedown', function(event) {
				event.preventDefault();
				that.isDrag = true;
				c('这里需要一个标记')
				// instace.mouseOffsetLeft = event.pageX - that.instace.moveEl.position().left;
				// 不考虑left，只做上下移动
				that.initTop = event.pageY;
				console.log(event.pageY)
				that.instace.mouseOffsetTop = event.pageY - that.instace.moveEl.offset().top;
				that.dragTime = setInterval(function(){
					that.dragMove();
				}, 16.7);
			});

			// 鼠标可能移出拖拽元素,需对document进行监听
			$(document).on('mousemove', function(event) {
				event.preventDefault();
				if(that.isDrag){
					that.mousePosition.x = event.pageX;
					that.mousePosition.y = event.pageY;
				}
			});

			$(document).on('mouseup', function(event) {
				event.preventDefault();
				clearInterval(that.dragTime);
				if(that.isDrag){
					// 判断位移够不够
					var moveY = that.mousePosition.y - that.initTop;
					that.showMask('.stage-mask');
					if (moveY < 10 || moveY > -10) {
						c('这里改了opacity?')
						that.instace.moveEl.animate({
							top: 0,
							opacity: 1
						}, 200, function() {
							c('209')
							that.resetDrag();
							that.hideMask('.stage-mask');
						})
					} else {
						// 请求取消中奖人的接口
						console.log('请求取消中奖人的接口')
						that.instace.moveEl.animate({
							opacity: 0
						}, 200, function() {
							that.delPrize();
							that.resetDrag();
							c('206')
							that.hideMask('.prize-mask');
							that.hideMask('.stage-mask');
						})
					}	
				}
				that.isDrag = false;
			});
		}

		// 展示奖品
		Card.prototype.showPrize = function() {
			var that = this;
			that.$lis.eq(that.index).find('.up').animate({
				'top': '-200px',
				'opacity': 0.5
			}, 720, function() {

			}).animate({
				'top': '-200px',
				'opacity': 0
			}, 80, function() {

			}).end().find('.down').animate({
				'top': '419px',
				'opacity': 0.5
			}, 720, function() {

			}).animate({
				'top': '419px',
				'opacity': 0.
			}, 80, function() {
				that.$lis.eq(that.index).find('.front-wrap').remove();
				that.sortIndex();
			})
		}

		// 重新排列queueIndex
		Card.prototype.sortIndex = function() {
			var that = this;
			var delt = that.queueI - 2; //正往左，负往右
			for (var i = 0; i < that.len; i++) {
				var oldQueneI = parseInt(that.$lis.eq(i).attr('data-queue-index'));
				if (delt == 1) {
					if (oldQueneI == 0) {
						that.$lis.eq(i).attr('data-queue-index', 4);
						that.changeZIndex(i);
					} else {
						that.$lis.eq(i).attr('data-queue-index', oldQueneI - 1);
					}
				} else if (delt == 2) {
					if (oldQueneI == 0) {
						that.$lis.eq(i).attr('data-queue-index', 3);
						that.changeZIndex(i);
					} else if (oldQueneI == 1) {
						that.$lis.eq(i).attr('data-queue-index', 4);
						that.changeZIndex(i);
					} else {
						that.$lis.eq(i).attr('data-queue-index', oldQueneI - 2);
					}
				} else if (delt == -1) {
					if (oldQueneI == 4) {
						that.$lis.eq(i).attr('data-queue-index', 0);
						that.changeZIndex(i);
					} else {
						that.$lis.eq(i).attr('data-queue-index', oldQueneI + 1);
					}
				} else if (delt == -2) {
					if (oldQueneI == 3) {
						that.$lis.eq(i).attr('data-queue-index', 0);
						that.changeZIndex(i);
					} else if (oldQueneI == 4) {
						that.$lis.eq(i).attr('data-queue-index', 1);
						that.changeZIndex(i);
					} else {
						that.$lis.eq(i).attr('data-queue-index', oldQueneI + 2);
					}
				} else if (delt == 0) {

				}
			}
			that.narrow();
			that.move();
		}

		// 各奖项移动
		Card.prototype.move = function() {
			var that = this;
			var time = "";
			for (var i = 0; i < that.len; i++) {
				var queueIndex = parseInt(that.$lis.eq(i).attr('data-queue-index'));
				that.$lis.eq(i).css('left', queueIndex * 340 + 80 * (queueIndex + 1) + 190 + 'px');
			}
			that.expand();
			time = setTimeout(function() {
				that.recoveryZIndex();
				that.isAnimating = false;
				that.hideMask('.stage-mask');
				that.showBlur();
			}, 600);
		}

		// 奖品放大
		Card.prototype.expand = function() {
			var that = this;
			that.$lis.eq(that.index).addClass('act');
			that.$lis.eq(that.index).css({
				'width': '460px',
				'height': '668px',
				'top': 426 - 87 + 'px',
				'left': '1050px'
			});
		}

		// 奖品缩小
		Card.prototype.narrow = function() {
			var that = this;
			that.$lis.removeClass('act');
			that.$lis.css({
				'width': '340px',
				'height': '494px',
				'top': '426px'
			});
		}

		// 获取中奖人信息
		Card.prototype.getPrizeUser = function() {
			var that = this;
			var current = that.$lis.eq(that.index);
			current.find('.front-f').css('display', 'block');
			/*ajax('http://localhost/pintuan/groupgoodsconfig/admin/listAll', {}, "GET").done(function(res) {
				that.spin(); //转牌
				current.find('.avatar img').attr('src', 'images/clw.jpg');
				current.find('.name').text('岑力炜');
				current.find('.c-department').text('小泰科技-门道事业部');
				setTimeout(function() {
					// current.find('.front-f').css('display', 'block');
					current.find('.front-f').css('opacity', 1);
				}, 1000);
			}).fail(function(err) {
				that.spin(); //转牌
				current.find('.avatar img').attr('src', 'images/clw.jpg');
				current.find('.name').text('岑力炜');
				current.find('.c-department').text('小泰科技-门道事业部');
				setTimeout(function() {
					// current.find('.front-f').css('display', 'block');
					current.find('.front-f').css('opacity', 1);
				}, 1000);
			})*/
			that.spin(); //转牌
			current.find('.avatar img').attr('src', 'images/clw.jpg');
			current.find('.name').text('岑力炜');
			current.find('.c-department').text('小泰科技-门道事业部');
			setTimeout(function() {
				// current.find('.front-f').css('display', 'block');
				current.find('.front-f').css('opacity', 1);
			}, 1000);
		}

		// 改变z-index为1
		Card.prototype.changeZIndex = function(i) {
			var that = this;
			that.$lis.eq(i).css('z-index', 1);
		}

		// 恢复z-index为3
		Card.prototype.recoveryZIndex = function() {
			var that = this;
			that.$lis.css('z-index', 3);
			that.$lis.eq(that.index).css('z-index', 100);
		}

		// 显示遮罩
		Card.prototype.showMask = function(el) {
			$(el).css('display', 'block');
		}

		// 隐藏遮罩
		Card.prototype.hideMask = function(el) {
			$(el).css('display', 'none');
		}

		// 显示卡牌上的blur
		Card.prototype.showBlur = function() {
			var that = this;
			that.$lis.not('.act').find('.front').addClass('blur');
		}

		// 隐藏卡牌上的blur
		Card.prototype.hideBlur = function() {
			var that = this;
			that.$lis.find('.front').removeClass('blur');
		}

		// 牌旋转
		Card.prototype.spin = function() {
			var that = this;
			that.$lis.filter('.act').find('.front,.front-f,.back').addClass('spin');
		}

		// 牌停止
		Card.prototype.stopSpin = function() {
			var that = this;
			that.$lis.filter('.act').find('.front,.front-f,.back').removeClass('spin');
		}

		// 隐藏中奖人
		Card.prototype.hidePrizeUser = function() {
			var that = this;
			var current = that.$lis.eq(that.index);
			//发请求确认中奖人
			/*ajax("url", {}, "GET").done(function() {

			}).fail(function() {

			})*/
			/*
			that.$lis.eq(that.index).find('.front-f').animate({
					width: '0px',
					height: '0px',
					opacity: 0
				},
				1000,
				function() {
					$(this).css('display', 'none');
					that.hideMask('.prize-mask');
				});
			*/
			current.find('.front-f').addClass('hide');
			setTimeout(function() {	
				that.delPrize();
				that.hideMask('.prize-mask');
			}, 1100);

		}

		// 清除中奖人信息
		Card.prototype.delPrize = function() {
			var that = this;
			var current = that.$lis.eq(that.index);
			current.find('.front-f').css({
				'display': 'none',
				'opacity': 0
			});
			current.find('.front-f').removeClass('hide');
			current.find('.avatar img').attr('src', '');
			current.find('.name').text('');
			current.find('.c-department').text('');
		}

		// 拖拽中奖人
		Card.prototype.dragMove = function() {
			var that = this;
			// 对Y轴不作边界限制
			var moveY = that.mousePosition.y - that.initTop;
			var elTop = that.mousePosition.y - that.instace.mouseOffsetTop;
			var calX = Math.abs(that.mousePosition.y,that.initTop);
			console.log(calX);
			if(calX >= 100){
				calX = 100;
			}
			that.instace.moveEl.css({
				top: elTop + 'px',
				// opacity: Math.min(1, 1- 0.01 * calX)
				opacity: 1
			});
		}

		// 重置drag
		Card.prototype.resetDrag = function(){
			var that = this;
			that.instace.mouseOffsetLeft = 0;
			that.instace.mouseOffsetTop = 0;
			that.mousePosition = {
				x: 0,
				y: 0
			};
			that.initTop = 0;
			that.dragTime = "";
			that.isDrag = false;
		}

		return Card;
	})()

	// var card = new Card();

	aaa = new Card();
});